<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>永和小票</title>
		<!-- 样式设定 -->
		<style type="text/css">
			body{
				width: 300px;
				font-size:10px;/*字体大小*/
				
			}
			/* 
			对应单独样式设置
			 class使用.
			 id 使用 #
			 */
			/*对单独的样式进行设置*/
			.please{
				font-size: 24px;
				font-weight: bold;/*字体加粗*/
			}
			.self{
				
				padding-left: 70px;/*左边空一定距离*/
				/*padding修饰四周--上右下左（顺时针一圈四个）*/
				padding: 10,50,20,100;
			}
			hr{
				border: 1px solid; /*一像素的实线*/
				border: 1px dashed; /*一像素的虚线*/
				
			}
			.note{
				/* padding-top:20px ; 上空
				padding-bottom: 15px ;  下空*/
				
				margin-top: 25px;
				margin-bottom: 20px;
			}
			img{
				padding-left: 55px;
			}
		</style>
	</head>
	<body >
		<!-- 
		    div标签---自动换行
			span标签---不换行
		 -->
		<div id="a"   >
			顾客联
		</div>
		<div id="b" class="please" >
			请您留意取餐账单号
		</div>
		<div id="c" class="self" >
			自取顾客联
		</div>
		<div id="d">
			永和大王（北三环西路店）
		</div>
		<div id="e">
			567478235793
		</div>
		<div id="" class="self">
			--结账单--
		</div>
		<div id="" class="please">
			账单号：p0000010
		</div>
		<div id="">
			账单类型：堂餐
		</div>
		<div id="">
			人数：1
		</div>
		<div id="">
			收银员：张静
		</div>
		<div id="">
			开单时间：2020-03-23 07:07:23:00
		</div>
		<div id="">
			结账时间：2020-03-23 07:07:29:00
		</div>
		<hr/>
		<!-- 表格没有列的概念，它叫做单元格 
		     页面中换行会被解析一个空格
			 align 横向排列：left居左，center居中，right 居右
			 valign 纵向排列，top居上，center居中，botton 居下
		-->
		<table border="0" cellspacing="" cellpadding="">
			<tr>
				<!--  -->
				<td width="50" align="center">数量</td>
				<td width="190">品项</td>
				<td width="50" align="center">金额</td>
			</tr>
			<tr>
				<td valign="top">1</td>
				<!-- 
				    网页中没有换行，
					他的换行只是一个空格，
					所以使用标签tr换行
				 -->
				<td>
					玉米肉松蛋饼2p<br/>
					1*----玉米肉松蛋饼<br/>
					1X-----现磨豆浆<br/>
				</td>
				<td valign="top" align="right">8.0</td>
			</tr>
		</table>
		<hr />
		<table border="0" cellspacing="" cellpadding="">
			<tr>
				<td width="246" >合计</td>
				<td width="50" align="right">8.0</td>
			</tr>
			<tr>
				<td>微支付</td>
				<td align="right">8.0</td>
			</tr>
		</table>
		<hr />
		<div id="">
			打印时间：2020-03-23 07:07:29:00
		</div>
		<hr />
		<!-- &nbsp;-----代表一个英文空格，七个空格等价于两个汉字的距离 -->
		<div id="" class="note">
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;根据相关税法规定，电子发票的开票日期同网上申请电子发票的日期，如您需要当日的电子发票请务必在消费当日通过扫描下方二维码，根据指引步骤开具您的增值税电子普通发票。此二维码30天有效，扫描时请保持小票平整。</div>
		
		</div>
		<!-- 
		     引入图片，只设置一个，它会等比缩放
			 src配置图片来源，相对路径，从自己的html文件中出发去找
			 
		 -->
		<img src="../images/捕获.PNG" align="center"  >
		<div id="">
			官网：www.yonghe.com.cn
		</div>
		<div id="">
			加盟热线：400-8208820
		</div>
	</body>
</html>
